<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>
<body>

</body>
<script>
/*
function fn() {
  setTimeout(() => {
    return 123
  }, 0)
  // return undefined
}

console.log(fn())
*/

//如何掌握一个概念
//用途+特征
//回调函数
//用途: 用来接受异步代码执行结果
//特性: 以参数的形式传递到函数当中执行,接受结果
/**/
// function fn(callback) {
//   setTimeout(() => {
//     callback(123)
//   }, 0)
//   // return undefined
// }
// fn(function(data){
//   console.log(data)
// })
//回调地狱
//特征: 多次嵌套
/*
fn(function(data1){
  console.log('data1',data1)
  fn(function(data2){
    console.log('data2',data2)
    fn(function(data3){
      console.log('data3',data3)
    })
  })
})
*/
// 回顾promise 语法
// const p = new Promise((resolve,reject)=>{
//   //  成功回调函数
//   //  resolve(11111)
//   reject(222)

// })
// p.then(res=>{
//   console.log('res',res);
// }).catch(err=>{
//   console.log('err',err);
// })
// 封装一个 promise 
function axios (data){
  return new Promise((resolve,reject)=>{
    resolve(data)
  })
}
const obj = {id:1}
// 链式调用解决promise
// axios(obj).then(res=>{
//   return axios(res)
// }).then(res=>{
//   return axios(res)
// }).then(res=>{
//   return axios(res)
// })

// 异步函数 
// 用途 : 简化 promise的接收 以同步的方式来加载异步的代码
// 特征 定义在方法前面 async 在promise前面加上 await
async function fn(){
  try{
  const res1 = await axios(obj)
  console.log(res1);
  
  const res2 = await axios(res1)
  console.log(res2);
  
  const res3 = await axios(res2)
  console.log(res3);
  
  const res4 = await axios(res3)
  console.log(res4);
  }catch(err){
    console.log(err);
  }finally{
  console.log(123555);
  }
}
fn()

</script>
</html>
